﻿@{
    Layout = null;

}
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客文章管理</title>

    <script src="~/lib/jq.js">
        const { axios } = require("../../wwwroot/lib/axios");
    </script>
    <script type="text/javascript" src="~/lib/vue.js"></script>
    <script src="~/lib/axios.js"></script>
    <!-- 引入样式 -->
    @* <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> *@
    <link href="~/css/icon.css" rel="stylesheet" />
    <!-- 引入组件库 -->
    @* <script src="https://unpkg.com/element-ui/lib/index.js"></script> *@
    <link href="~/lib/element-ui/index.css" rel="stylesheet" />
    <script src="~/lib/element-ui/index.js"></script>
    <style>
        .image-wrapper {
            position: relative;
            display: inline-block;
            margin: 10px;
        }

        .preview-img {
            width: 100px;
            height: 100px;
            border-radius: 4px;
        }

        .delete-btn {
            position: absolute;
            top: 5px;
            right: 5px;
            width: 24px;
            height: 24px;
            background: rgba(255,0,0,0.7);
            color: white;
            border: none;
            border-radius: 50%;
            cursor: pointer;
            opacity: 0;
            transition: opacity 0.3s;
        }

        .image-wrapper:hover .delete-btn {
            opacity: 1; /* 悬停时显示 */
        }

        input {
            outline: none;
        }

        textarea {
            outline: none;
        }

        .NewManagePage {
            width: 100%;
            height: 100%;
            background-color: #ffffff;
        }

        .search {
            width: 600px;
            height: 100px;
            margin: 0 auto;
            text-align: center;
            line-height: 90px;
        }

        .hide {
            /*隐藏元素*/
            display: none;
        }

        .modal {
            /* 上左定位50%后 上左margin-高度和宽度的一半保证div在中心位置 */
            position: fixed;
            left: 50%;
            top: 50%;
            width: 700px;
            height: 900px;
            margin-left: -350px;
            margin-top: -350px;
            z-index: 10;
            background-color: #ffff;
        }
            /*模态框标题样式*/
            .modal h2 {
                color: #666666;
                font-size: 20px;
                line-height: 39px;
                position: absolute;
                top: -25px;
                left: 0px;
            }

            .modal .close {
                position: absolute;
                top: 0px;
                right: 0px;
                /* 去掉按钮边框 */
                border: none;
                cursor: pointer;
                color: #ffffff;
                /* 设置圆角角度 */
                /*border-radius: 5px 5px 5px 5px;*/
                /* 移动鼠标前的效果 渐变色 */
                background-image: linear-gradient(#4CAF50, #5883a4);
            }


                .modal .close:hover {
                    /* 移动鼠标后的效果 渐变色 */
                    background-image: linear-gradient(#5883a4, #666666);
                }

        .shade {
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            opacity: 0.6;
            background-color: black;
            z-index: 9;
        }

        .Huiform {
            margin-top: 80px;
        }


        .tablelist th {
            border-collapse: collapse;
            font-size: 15px;
            font-family: Arial;
            text-align: center;
            height: 60px;
            /*width: 400px;*/ /*要显示文字的宽度*/
            text-overflow: ellipsis; /*让截断的文字显示为点点。还有一个值是clip意截断不显示点点*/
            /*overflow: hidden;*/ /*超出要隐藏*/
        }

        table {
            border-collapse: collapse;
            margin: 0 auto;
            text-align: center;
        }

            table td, table th {
                border: 1px solid #cad9ea;
                color: #666;
                height: 30px;
            }

            table thead th {
                background-color: #CCE8EB;
                width: 100px;
            }

            table tr:nth-child(odd) {
                background: #fff;
            }

            table tr:nth-child(even) {
                background: #F5FAFA;
            }


        .cl {
            height: 30px;
            /* 去掉按钮边框 */
            border: none;
            cursor: pointer;
            color: #fff;
            /* 设置圆角角度 */
            border-radius: 5px 5px 5px 5px;
            /* 移动鼠标前的效果 渐变色 */
            background-image: linear-gradient(#5883a4, #2e7497);
        }

            .cl:hover {
                /* 移动鼠标后的效果 渐变色 */
                background-image: linear-gradient(#0e6e97, #075988);
            }

        .btn {
            height: 30px;
            /* 去掉按钮边框 */
            width: 80px;
            border: none;
            cursor: pointer;
            color: #fff;
            /* 设置圆角角度 */
            border-radius: 5px 5px 5px 5px;
            /* 移动鼠标前的效果 渐变色 */
            background-image: linear-gradient(#2a8c66, #39895d);
        }

            .btn:hover {
                /* 移动鼠标后的效果 渐变色 */
                background-image: linear-gradient(#05a146, #0bb02c);
            }

        .omit {
            /* text-overflow: ellipsis; 需要配合这两个属性使用 white-space: nowrap;  overflow: hidden;*/
            /* overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    width: 500px;
                    height: 35px;*/
            overflow: hidden; /*溢出文字隐藏*/
            display: -webkit-box;
            -webkit-line-clamp: 2; /*在第二行变为...*/
            -webkit-box-orient: vertical;
        }

        #paging {
            width: 200px;
            height: 200px;
            background-color: orangered;
        }

        ul.pagination {
            display: inline-block;
            width: 500px;
            padding: 0;
            margin: 0 auto;
        }

            ul.pagination li {
                display: inline;
            }

                ul.pagination li a {
                    color: black;
                    float: left;
                    padding: 8px 16px;
                    text-decoration: none;
                    border-radius: 5px;
                }

                    ul.pagination li a.active {
                        background-color: #4CAF50;
                        color: white;
                        border: 1px solid;
                        border-radius: 5px;
                    }

                    ul.pagination li a:hover:not(.active) {
                        background-color: #4CAF50;
                        color: white;
                        border-radius: 5px;
                    }

        #bannerTable {
            width: 100%;
            color: rgb(144, 147, 153);
            z-index: 1;
        }

        #text-k {
            color: #606266;
        }

        .p-1 {
            color: orangered;
            display: inline;
        }

        .tr-1:hover {
            background-color: antiquewhite;
        }
        /* a链接去除下划线*/
        a {
            text-decoration: none;
        }


        #jumpBtn {
            background-color: #3498db;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
            border-radius: 4px;
        }

            #jumpBtn:hover {
                background-color: #2980b9;
                box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
            }

        #uploadFlie {
            background-color: #3498db;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
            border-radius: 4px;
        }

            #uploadFlie:hover {
                background-color: #2980b9;
                box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
            }


        .xs {
            background-color: #3498db;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
            border-radius: 4px;
        }

            .xs:hover {
                background-color: #2980b9;
                box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
            }


        .upload {
            background-color: #3498db;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
            border-radius: 4px;
        }

            .upload:hover {
                background-color: #2980b9;
                box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
            }
    </style>

</head>

<body>

    <div class="NewManagePage">

        <div class="search">

            文章类别:
            <select class="select">
                <option value="0">选择一个文章类别</option>
                <option value="1" v-for=" item  in NewsType" v-on:click="gettypeid(item.typeId)" :key="item.typeId">{{item.typeName}}</option>

            </select>
            &nbsp;
            <input type="text" class="input-text" style="width:250px" placeholder="输入文章标题" id="" name="">&nbsp;<button type="submit" class="btn btn-success" id="" name="">
                <i class="icon-search"></i> 搜文章
            </button>

        </div>

        <div>
            <span class="l">

                <button href="javascript:;" class="cl" v-on:click="openModal"><i class="icon-plus"></i> 添加博客文章</button>
                <br /><br />
                @*<a href="javascript:;" class="cl"><i class="icon-plus"></i> 添加新闻</a>*@
            </span>

        </div>
        <!-- 模态框 -->
        <div class="shade hide"></div>
        <div class="modal hide">
            <div class="Huiform">
                <h2>{{ModalTitle}}</h2> <p v-if="hint">您先添加这些基本信息后再编辑文章内容！ </p>  <button class="close" v-on:click="CloseModal">关闭</button>
                <hr />

                <table class="table  table-bg">
                    <tbody>
                        <tr v-if="NewsIdDisplay">
                            <th><span class="c-red"><p class="p-1">*</p></span> ID：</th>
                            <td>

                                <p></p>
                                <input type="text" id="NewsId" v-model="NewsId" disabled style="border: none; width:auto; background-color: #f8f9fa; padding: 5px;">
                            </td>
                        </tr>
                        <tr>
                            <th><span class="c-red"><p class="p-1">*</p></span> 文章标题：</th>
                            <td>
                                <input type="text" id="NewsTitle" style="width:300px" v-model="NewsTitle">
                            </td>
                        </tr>
                        <tr>
                            <th class="text-r"><span class="c-red"><p class="p-1">*</p></span> 文章类别：</th>
                            <td>

                                <select id="select" v-on:change="gettypeid($event)">
                                    <option value="0">选择一个文章类别</option>
                                    <option :value="item.typeId" v-for=" item  in NewsType" :key="item.typeId">{{item.typeName}}</option>

                                </select>
                            </td>
                        </tr>
                        <tr>
                            <th class="text-r"><p class="p-1">*</p>文章图片：</th>
                            <td>
                                @*<input type="file" id="fileInput" multiple v-on:change="upload">*@

                                <input type="file" class="upload" v-on:change="upload" multiple nullmsg="文章图片不能为空"><input type="button" v-on:click="uploadFlie" value="上传图片" id="uploadFlie" />
                            </td>


                        </tr>
                        <tr>
                            <th class="text-r"><p class="p-1">*</p>文章图片：</th>
                            <td>
                                <div class="image-container">
                                    <div v-for="(url, index) in images" :key="index" class="image-wrapper">
                                        <img :src="decryptedIp+url" v-if="url!==''" class="preview-img" />
                                        <button v-on:click="handleDelete(url)"
                                                class="delete-btn">
                                            ×
                                        </button>
                                    </div>
                                </div>
                            </td>


                        </tr>

                        <tr v-if="newsContentsDisplay">
                            <th class="text-r"><p class="p-1">*</p>文章内容预览：</th>
                            <td>

                                <textarea disabled id="newsContent" v-model="NewsContent" style="height:400px;width:570px;"></textarea>
                            </td>
                            <button id="jumpBtn" v-if="EtidNewsBut">点击编辑博客文章内容</button>
                        </tr>
                        <tr>
                            <th class="text-r">文章备注：</th>
                            <td><input type="text" v-model="Remark" /></td>
                        </tr>
                        <tr>
                            <th></th>
                            <td><button class="xs" v-if="AddBut" v-on:click="NewsSend" type="button"> 添加</button> <button v-on:click="UpdateNews" class="xs" v-if="UpdateBut"> 修改</button></td>
                            <td></td>
                        </tr>
                    </tbody>

                </table>

            </div>

        </div>
        <table width="100%" class="tablelist">
            <thead>
                <tr id="bannerTable">

                    <th width="80">ID</th>
                    <th width="100">类别名称</th>
                    <th width="200">标题</th>
                    <th width="400">内容</th>
                    <th width="150">发布日期</th>
                    <th width="200">备注</th>
                    <th width="100">操作</th>
                </tr>
            </thead>

            <tr v-for=" item in News" :key="item.d" class="tr-1">

                <td>{{item.id}}</td>
                <td>{{item.typeInfo}}</td>
                <td>{{item.newsTitle}}</td>
                <td><p class="omit">{{item.newsContent}}</p></td>
                <td>{{item.publishDate}}</td>
                <td>{{item.remark}}</td>
                <td>

                    <a href="#" v-on:click="Newsdelete(item.id)">隐藏</a> |
                    <a href="#" v-on:click="Newsdelete(item.id)">删除</a> |
                    <a href="#" v-on:click="NewsEdit(item.id)">编辑</a>

                </td>
            </tr>

        </table>


        <div>
            <ul class="pagination">
                <li><a href="#">«</a></li>
                <li v-for="item in pagingCount"><a v-on:click="GetPaging(item)" style="cursor:pointer;">{{item+1 }}</a></li>
                <li><a href="#">»</a></li>
            </ul>
        </div>



    </div>
</body>

</html>

<script>

        $(document).ready(function () {

            //#点击按钮跳转新闻内容编辑页面 传递新闻标题和id
            $('#jumpBtn').click(function () {
                // console.log('测试');
                // 获取输入框的值
                var newsTitle = $('#NewsTitle').val();
                var newsId = $('#NewsId').val();
                var newsContent = $('#newsContent').val();

                console.log(newsTitle);

                localStorage.setItem("NewsContent", newsContent);
                //window.location.href = '/admin/NewsEdit?param1=' + newsTitle + '&param2=' + newsId+'';
                // Open the new page in a new tab/window
                window.open('/admin/NewsEdit?param1=' + newsTitle + '&param2=' + newsId, '_blank');
            });
        });





        var app = new Vue({
            el: '.NewManagePage',
            data: {
                pagingCount: [],


                NewsType: [],
                News: [],
                ModalTitle: "添加博客文章",

                params: Object,
                Image: "",
                images:[],
                NewsId:0,
                NewsTitle: "",
                NewsContent: "",
                pageindex: 1,
                decryptedIp:"",
                xorKey: 'xiaoweiIPKey', // 密钥存于data中
                InfoType: 0,
                Remark: '备注',
                AddBut: true,
                EtidNewsBut:true,
                UpdateBut: true,
                newsContentsDisplay: true,
                NewsIdDisplay:true,
                hint:true

            },
            updated() {

            },

            mounted() {
                axios({
                    method: 'Get',
                    url: '/admin/GetNewsType'

                }).then(res => {
                    if (res.data.code == 200) {

                        this.NewsType = res.data.data;


                    }


                }).catch(err => {
                    console.log('GetNewsType执行了');
                    console.log(err);
                }

                )


                axios({
                    method: 'Post',
                    url: '/admin/NewsPaging',
                    data: {
                        pageindex: 1,
                        pageSize: 5
                    }

                }).then(result => {

                    localStorage.setItem('xiaoWeiWebsiteIP', result.data.websiteIP);


                    //获取到分页有多少页遍历按钮
                    var temp = result.data.pagingCount == 1 ? 2 : result.data.pagingCount;
                    var arr = new Array();
                    for (var i = 0; i < temp; i++) {
                        arr.push(i);
                    }
                    console.log(arr);
                    this.pagingCount = arr;
                    console.log(this.pagingCount);

                    this.News = result.data.pagingData;

                    console.log(this.News);

                }).catch(err => {
                    console.log(err);
                })




            },
            methods: {
     xorCrypt(text) {
      let decrypted = '';
      for (let i = 0; i < text.length; i++) {
        const keyChar = this.xorKey.charCodeAt(i % this.xorKey.length);
        decrypted += String.fromCharCode(text.charCodeAt(i) ^ keyChar);
      }
      this.decryptedIp = decrypted; // 覆盖而非追加
      console.log("解密IP", this.decryptedIp);
    },
                CloseModal() {
                    $('.modal,.shade').addClass('hide');

                },

                gettypeid(typeid) {




                    this.InfoType = parseInt(typeid.target.value);

                },
                //分页
                GetPaging(e) {


                    axios({
                        method: 'Post',
                        url: '/admin/NewsPaging',
                        data: {
                            pageindex: e + 1,
                            pageSize: 5
                        }

                    }).then(result => {

                        this.News = result.data.pagingData;
                    }).catch(err => {
                        console.log(err);
                    })
                },

                //（隐藏）删除
                Newsdelete(id) {

                    axios({
                        method: 'Post',
                        url: '/admin/DelNews',
                        data: {
                            id: id
                        }

                    }).then(res => {
                        console.log(res);
                        console.log(res.data);
                        console.log(res.data.code)

                        if (res.data.code == 200) {
                            this.$alert('博客文章删除成功,前台已经看不到这条博客文章了！', '信息提示', {
                                confirmButtonText: '确定'

                            });
                            axios({
                                method: 'Post',
                                url: '/admin/NewsPaging',
                                data: {
                                    pageindex: 1,
                                    pageSize: 5
                                }

                            }).then(result => {


                                //获取到分页有多少页遍历按钮
                                var temp = result.data.pagingCount == 1 ? 2 : result.data.pagingCount;
                                var arr = new Array();
                                for (var i = 0; i < temp; i++) {
                                    arr.push(i);
                                }
                                console.log(arr);
                                this.pagingCount = arr;
                                console.log(this.pagingCount);

                                this.News = result.data.pagingData;

                                console.log(this.News);

                            }).catch(err => {
                                console.log(err);
                            })


                        } else {

                            this.$alert('博客文章删除成功', '信息提示', {
                                confirmButtonText: '确定'

                            });

                        }

                    }).catch(err => { console.log(err) })

                },
                        //删除
                    Newsdelete(id) {

                        axios({
                            method: 'Post',
                                url: '/admin/DelectNews',
                            data: {
                                id: id
                            }

                        }).then(res => {
                            console.log(res);
                            console.log(res.data);
                            console.log(res.data.code)

                            if (res.data.code == 200) {
                                this.$alert('博客文章删除成功！', '信息提示', {
                                    confirmButtonText: '确定'

                                });
                                axios({
                                    method: 'Post',
                                    url: '/admin/NewsPaging',
                                    data: {
                                        pageindex: 1,
                                        pageSize: 5
                                    }

                                }).then(result => {


                                    //获取到分页有多少页遍历按钮
                                    var temp = result.data.pagingCount == 1 ? 2 : result.data.pagingCount;
                                    var arr = new Array();
                                    for (var i = 0; i < temp; i++) {
                                        arr.push(i);
                                    }
                                    console.log(arr);
                                    this.pagingCount = arr;
                                    console.log(this.pagingCount);

                                    this.News = result.data.pagingData;

                                    console.log(this.News);

                                }).catch(err => {
                                    console.log(err);
                                })


                            } else {

                                this.$alert('博客文章删除成功', '信息提示', {
                                    confirmButtonText: '确定'

                                });

                            }

                        }).catch(err => { console.log(err) })

                    },

                        handleDelete(url){
        const index = this.images.indexOf(url);
        console.log(index);
        if (index > -1) {
        this.images.splice(index , 1)
        }
        console.log("删除指定图片后数组",this.images);
                        },
                //编辑
                NewsEdit(e) {
                    this.AddBut = false;
                    this.UpdateBut = true;
                    this.hint=false;
                    this.EtidNewsBut = true;
                    this.newsContentsDisplay = true;
                    this.NewsIdDisplay = true;
                    this.ModalTitle = "编辑博客文章";

                    localStorage.setItem("NewsId", e);
                    $('.hide').removeClass('hide');

                    axios({
                        url: '/admin/GetEditNews',
                        method: "post",
                        data: {
                            id: e

                        }
                    }).then(res => {
                        //让下拉框默认选中
                        $("#select option[value=" + res.data.data.infoType + "]").prop("selected", true);

                        console.log("获取到加密后的字符串",res.data);
                        this.xorCrypt(res.data.message);
                        console.log(res.data.data.image);
                        this.Image = res.data.data.image;
                        this.images = res.data.data.image.split(','); // 将图片路径字符串转换为数组
                        this.InfoType = res.data.data.infoType;
                        this.NewsContent = res.data.data.newsContent;
                        this.NewsTitle = res.data.data.newsTitle;
                        this.NewsId = res.data.data.id;
                        this.Remark = res.data.data.remark;




                    }).catch(err => {

                        console.log(err);
                    })




                },





                openModal() {
                    this.UpdateBut = false;
                    this.AddBut = true;
                    this.EtidNewsBut=false;
                    this.newsContentsDisplay=false;
                    this.NewsIdDisplay=false;
                    this.hint=true;
                    this.ModalTitle = "添加博客文章";
                    $('.hide').removeClass('hide');
                },
                CloseModal() {
                    $("#select option[value=" + 0 + "]").prop("selected", true);
                    this.Image = "";
                    this.InfoType = 0;
                    this.NewsContent = "";
                    this.NewsTitle = "";
                    this.Remark = "";
                    this.NewsId=0;
                    $('.modal,.shade').addClass('hide');

                },
                upload(e) {
                    let files = e.target.files;
                    console.log({ data: files });

                    let param = new FormData(); // Create form object
                    for (let i = 0; i < files.length; i++) {
                        param.append('files', files[i]); // Append files to form data
                    }
                    console.log(param); // Add other data to form if needed
                    this.params = param;

                    if (this.params.getAll('files').length > 0) {
                        console.log("文件已准备好上传");
                        console.log(this.params.getAll('files'));
                    }
                },
                uploadFlie() {
                    alert("正在启动上载");
                    if (this.params && this.params.getAll('files').length > 0) {
                        axios.post('/admin/FileSave', this.params, {
                            'Content-Type': 'multipart/form-data'
                        })
                            .then(res => {
                                if (res.status == 200) {

                                    let imageliststr = res.data.join(',');

                                    this.Image = imageliststr + ',' + this.Image;

                                        if(res.data!=null){
                                alert("已成功上传了"+res.data.length+"图像。请继续填写其他博客文章信息。");
                                        }

                                }
                            })
                            .catch(err => {
                                console.log(err);
                            });
                    }
                },
                //编辑新闻
                UpdateNews() {
                    if (this.InfoType == 0) {
                        alert("您还没选择博客文章类型哦");
                              //  var temp = localStorage.getItem("NewsId");
                              // var id = parseInt(temp);
                        return;
                    }
                    var dbimage='';
             this.Image= this.images.join();
               
                console.log("删除后图片路径",dbimage);
             var data= {    Id:this.NewsId,
                            NewsTitle: this.NewsTitle,
                            InfoType: this.InfoType,
                            Image: this.Image,
                            Remark: this.Remark,
                            NewsContent: this.NewsContent
                        };
                        console.log("存储数据打印",data);
             
                    axios({
                        method: 'Post',
                        url: '/admin/EditNews',
                        data: data
                    }).then(res => {

                        if (res.data) {
                            alert("修改成功");
                            $('.modal,.shade').addClass('hide');
                            $("#select option[value=" + 0 + "]").prop("selected", true);
                            this.Image = "";
                            this.InfoType = 0;
                            this.NewsContent = "";
                            this.NewsTitle = "";
                            this.Remark = "";

                        }

                    })
                },
                NewsSend() {

                    if (this.InfoType == 0) {
                        alert("您还没选择博客文章类型哦");
                        return;
                    }
                    console.log("博客文章备注：", this.Remark);
                    console.log("博客文章图片路径:", this.Image);
                    console.log("博客文章标题:", this.NewsTitle);
                    console.log("博客文章类别id:", this.InfoType);
                    console.log("博客文章内容:", this.NewsContent);
                    if (this.Image == "") {
                        alert("图片博客文章未上传");
                    }


                    axios({
                        method: 'Post',
                        url: '/admin/AddNews',
                        data: {
                            NewsTitle: this.NewsTitle,
                            InfoType: this.InfoType,
                            Image: this.Image,
                            Remark: this.Remark,
                            NewsContent: this.NewsContent
                        }

                    }).then(res => {
                        if (res.data.code == 200) {

                            this.Image="";
                            alert("博客文章添加成功");
                            this.CloseModal();

                        } else {

                            alert("博客文章添加失败" + res.data.message);
                        }

                    }).catch(err => { console.log(err) })
                }

            }





        });

</script>